<?php
session_start();
require 'config.php'; // 包含数据库连接配置

// 处理登录请求
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $username = $_POST['username'];
    $password = $_POST['password'];

    // 查询用户
    $stmt = $pdo->prepare('SELECT * FROM users WHERE username = ?');
    $stmt->execute([$username]);
    $user = $stmt->fetch();

    if ($user && password_verify($password, $user['password'])) {
        // 登录成功，将用户信息存储到会话中
        $_SESSION['user'] = [
            'id' => $user['id'],
            'username' => $user['username'],
            'name' => $user['name'],
            'role' => $user['role'] // 确保包含角色信息
        ];

        // 跳转到文件管理页面
        header('Location: index.php');
        exit();
    } else {
        $error = '用户名或密码错误';
    }
}
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>登录 - 文件管理系统</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <style>
        /* 自定义样式 */
        .btn {
            width: 100%;
        }
        /* 调整公告的z-index以确保在最上层 */
        .announcement {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1050; /* Bootstrap 的z-index警告框是1040 */
            border-radius: 0;
        }
        body {
            padding-top: 80px; /* 为公告预留空间 */
        }
        /* 登录区域样式 */
        .login-container {
            margin-top: 40px;
        }
        .login-image {
            max-width: 100%;
            height: auto;
            border-radius: 5px;
        }
    </style>
</head>
<body>
    <!-- 系统使用公告 -->
    <div class="alert alert-info alert-dismissible fade show text-center announcement animate__animated animate__fadeInDown" role="alert">
        如果没有账号，请联系管理员发放！
        <link rel="stylesheet" href="css/animate.min.css"/>
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="关闭"></button>
    </div>
    <script>
        document.querySelector('.btn-close').addEventListener('click', function() {
            var announcement = document.querySelector('.announcement');
            announcement.classList.remove('animate__fadeInDown');
            announcement.classList.add('animate__fadeOutUp');
            announcement.addEventListener('animationend', function() {
                announcement.style.display = 'none';
            });
        });
    </script>

    <div class="container py-4 login-container">
        <div class="row justify-content-center align-items-center">
            <!-- 图片部分 -->
            <div class="col-md-6 mb-4 mb-md-0 d-none d-md-block">
                <img src="images/logo.jpg" alt="登录图片" class="login-image">
            </div>
            <!-- 标题部分 -->
            <div class="col-md-6 d-md-none">
                <h2 class="text-center d-md-none">文件管理系统！</h2>
            </div>
            <!-- 登录表单部分 -->
            <div class="col-md-6">
                <h1 class="text-center mb-4">登录</h1>
                <?php if (isset($error)) : ?>
                    <div class="alert alert-danger"><?php echo htmlspecialchars($error); ?></div>
                <?php endif; ?>
                <form method="post">
                    <div class="mb-3">
                        <label for="username" class="form-label">用户名</label>
                        <input type="text" class="form-control" id="username" name="username" required>
                    </div>
                    <div class="mb-3">
                        <label for="password" class="form-label">密码</label>
                        <input type="password" class="form-control" id="password" name="password" required>
                    </div>
                    <button type="submit" class="btn btn-primary">登录</button>
                </form>
            </div>
        </div>
    </div>

    <!-- 引入脚本 -->
    <script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>